<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%--
  Created by IntelliJ IDEA.
  User: qupen
  Date: 2016/10/21
  Time: 11:01
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="zh">

<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>SIEMENS LOGIN</title>

    <!-- CSS -->
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/login.css">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->

    <!-- Favicon and touch icons -->
    <%-- <link rel="shortcut icon" href="/image/favicon.png">
     <link rel="apple-touch-icon-precomposed" sizes="144x144" href="/image/apple-touch-icon-144-precomposed.png">
     <link rel="apple-touch-icon-precomposed" sizes="114x114" href="/image/apple-touch-icon-114-precomposed.png">
     <link rel="apple-touch-icon-precomposed" sizes="72x72" href="/image/apple-touch-icon-72-precomposed.png">
     <link rel="apple-touch-icon-precomposed" href="/image/apple-touch-icon-57-precomposed.png">
 --%>
</head>

<body>

<!-- Top content -->
<div class="top-content">

    <div class="inner-bg">
        <div class="container">
            <div class="row">
                <div class="col-sm-6 col-sm-offset-3 form-box">
                    <div class="form-top">
                        <div class="row">
                            <div class="form-top-left">
                                <img src="/images/logo.png">
                            </div>
                            <div class="form-top-right">
                                <i class="fa fa-key"></i>
                            </div>
                        </div>
                    </div>
                    <div class="form-bottom">
                        <c:if test="${message!=null}">
                            <div style="color: #af235f;margin-bottom: 10px;">${message}</div>
                        </c:if>
                        <form role="form" action="/admin/api/login" method="post" class="login-form">
                            <div class="form-group">
                                <label class="sr-only"><spring:message code="label.tenant.children.name"/></label>
                                <input name="username" type="text" placeholder="<spring:message code="label.please.enter.username"/>"
                                       class="form-username form-control" autofocus>
                            </div>
                            <div class="form-group">
                                <label class="sr-only"><spring:message code="label.login.password"/></label>
                                <input name="password" type="password"  placeholder="<spring:message code="label.login.password"/>"
                                       class="form-password form-control">
                            </div>
                            <button type="submit" class="btn"><spring:message code="label.login"/></button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Javascript -->
<script src="/js/jquery-2.2.3.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
<script src="/js/jquery.backstretch.min.js"></script>

<script>
    $(document).ready(function () {
        $.backstretch("/images/background.jpg");
    });

    $('.login-form input[type="text"], .login-form input[type="password"], .login-form textarea').on('focus', function() {
        $(this).removeClass('input-error');
    });

    $('.login-form').on('submit', function(e) {

        $(this).find('input[type="text"], input[type="password"], textarea').each(function(){
            if( $(this).val() == "" ) {
                e.preventDefault();
                $(this).addClass('input-error');
            }
            else {
                $(this).removeClass('input-error');
            }
        });
    });
</script>
</body>

</html>